<template>
  <a-row type="flex" :gutter="[24,8]" class="blog-card-container">
    <a-col :span="12" v-for="item of itemList" :key="item.id">
      <a-card hoverable
              :style="item.style" data-aos="zoom-in">
        <a-card-meta title="https://spring.io/" :description="item.description">
          <a-avatar slot="avatar" :src="item.logo"
                    size="large" shape="circle" style="width: 60px;height: 60px;border-radius: 50%;"/>
        </a-card-meta>
      </a-card>
    </a-col>
  </a-row>

</template>


<script>
  //aos动画
  import AOS from 'aos/dist/aos'

  export default {
    props: {
      itemList: {
        type: Array,
        required: true
      }
    },
    name: 'BlogCardList',
    components: {},
    created() {
      // 初始化动画
      AOS.init({
        easing: 'ease-in-out-sine'
      })
    }
  }
</script>

<style scoped>

</style>